<template>
	<!-- 销货单 -->
	<div>
		<el-breadcrumb class="breadcrumb" separator-class="el-icon-arrow-right">
			<el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
			<el-breadcrumb-item>销货单</el-breadcrumb-item>
		</el-breadcrumb>
		<nav class="nav">
			<el-button size="small" icon='plus' type="primary" @click="add">添加+</el-button>
		</nav>
		<div class="order_seek">
			<div class="crux">
				<div class="seek_l">
					<div>客户名称：</div>
					<el-input v-model="params.supplierName" size="small" clearable/>
				</div>
				<div class="seek_l">
					<div>联系人/电话：</div>
					<el-input v-model="params.supplierContactOrPhone" size="small" clearable/>
				</div>
				<div class="seek_l">
					<div></div>
					<div></div>
				</div>
				<div class="seek_l">
					<div></div>
					<el-button size="small" type="success" @click="getList">搜 索</el-button>
				</div>
			</div>
		</div>
		<el-table :summary-method="utils.getERPSummaries" show-summary border :data="goodsArr" style="width: 100%" max-width="1000">
			<el-table-column prop="id" label="分录号" fixed show-overflow-tooltip>
			</el-table-column>
			<el-table-column prop="paymentNumber" label="收付款凭证号" show-overflow-tooltip>
			</el-table-column>
			<el-table-column prop="invoiceNumber" label="发票编号" show-overflow-tooltip>
			</el-table-column>
			<el-table-column prop="amount" label="总金额" show-overflow-tooltip>
			</el-table-column>
			<el-table-column prop="qty" label="数量">
			</el-table-column>
			<el-table-column prop="supplierName" label="供应商" show-overflow-tooltip>
			</el-table-column>
			<el-table-column prop="supplierContact" label="供应商联系人	" show-overflow-tooltip>
			</el-table-column>
			<el-table-column prop="supplierMobile" label="供应商手机" show-overflow-tooltip>
			</el-table-column>
			<el-table-column prop="state" label="状态">
			</el-table-column>
			<el-table-column label="操作">
				<template slot-scope="scope">
					<el-button size="small" @click="detail(scope.row.id)" type="success">查看明细</el-button>
				</template>
			</el-table-column>
		</el-table>
		<el-pagination class="page-num" background layout="prev, pager, next" :page-size="page_size" @current-change="handleCurrentChange" :total="page">
		</el-pagination>
	</div>
</template>
<script>
export default {
	name: 'manage',
	data() {
		return {
			type:'',
			title: '',
			date: '',
			goodsArr: [],
			params: {
				"numPerPage": 10,			//每页记录数
				"order": "asc",				//排序顺序
				"pageNum": 1,				//当前页数
				"stockUseType": "SALES",	//单据类型
				"invoiceNumber": "",		//发票编号
				"orderDate": "",			//下单时间
				"paymentNumber": "",		//收付款凭证号
				"receiptNumber": "",		//单据编号
				"sort": "",					//排序字段
				"supplierContactOrPhone": "",//联系人/手机号
				"supplierName": ""			//客户名称
			},
			page_size: 10, //每页显示几个
			page: 0, //总页数
			currentPage: 1, //当前页
		};
	},
	components: {},
	created() {
	},
	mounted() {
		this.getList();
		this.$forceUpdate();
	},
	methods: {
		/*分页跳转*/
		handleCurrentChange: function (currentPage) {
			this.currentPage = currentPage;
			this.getList();
		},
		// 获取列表
		getList() {
			this.params.pageNum = this.currentPage;
			this.params.orderDate = this.params.orderDate==""?'':this.params.orderDate/1000;
			this.$post("stockUseList", this.params).then(res => {
				if (res.code == 200) {
					this.goodsArr = [];
					this.page = res.data.total;
					var list = res.data.rows;
					for (var i in list) {
						console.log(list[i])
						list[i].state = list[i].state == "RECEIVED" ? '已收货' : '未收货';
						this.goodsArr.push(list[i]);
					}
				} else {
					this.$msg.warning(res.message);
				}
			});
		},
		add() {
			this.$router.push({
				name: "addSalesList",
				params: {
					type: "SALES"
				}
			})
		},
		// 跳转详情页面
		detail(id) {
			this.$router.push({
				name: 'salesListGoods',
				params: {
					id: id
				}
			})
		}
	},
}
</script>
<style lang="less" scoped>
.nav {
  display: flex;
  justify-content: flex-end;
}

.order_seek {
  background-color: #f6f6f6;
  border: 1px solid #dddddd;
  margin-top: 15px;
  overflow: hidden;
  margin-bottom: 18px;
  line-height: 50px;
  .crux {
    display: flex;
    flex-wrap: wrap;
    padding: 4px 9px;
    .seek_l {
      display: flex;
      width: 260px;
      flex-direction: row;
      justify-content: space-between;
      padding-left: 10px;
      > div {
        width: 120px;
      }
      .el-input {
        flex: 1;
      }
      .el-button {
        width: 100px;
        height: 30px;
        margin: 10px 0;
      }
    }
    .z_s_list {
      overflow: hidden;
      float: left;
      margin-left: 33px;
    }
  }
}
</style>